<template>
	<div class="boxmain">
		<h3>生成PDF分析<el-button type="primary" @click="shuaxinjd">刷新进度</el-button></h3> 
		<el-table
		    :data="tableData"
		    border
		    style="width: 100%">
		    <el-table-column
		      label="报表级别"
		      width="180">
			  <template slot-scope="scope">
				<span v-if="scope.row.pdfType == 3">{{scope.row.pdfName}}<div style="color: #86909C;">联考报表(整)</div></span>
			    <span v-if="scope.row.pdfType == 0">{{scope.row.pdfName}}<div style="color: #86909C;">学科报表</div></span>
			    <span v-else-if="scope.row.pdfType == 2">{{scope.row.pdfName}}<div style="color: #86909C;">联考报表</div></span>
			    <span v-else-if="scope.row.pdfType == 1">{{scope.row.pdfName}}<div style="color: #86909C;">学校报表</div></span>
			  </template>
		    </el-table-column>
		    <el-table-column
		      label="学校"
		      width="180">
			  <template slot-scope="scope">
				  {{scope.row.pdfType==2?'联考报表':scope.row.pdfType==0?'学科报表':scope.row.schoolName}}
			  </template>
		    </el-table-column>
		    <el-table-column
		      label="生成时间">
			  <template slot-scope="scope">
			  		{{scope.row.updateTime?scope.row.updateTime:scope.row.createTime}}
			  </template>
		    </el-table-column>
			<el-table-column
			  label="状态">
			  <template slot-scope="scope">
					<div v-if="scope.row.pdfType!=3">
						  <el-tag v-if="scope.row.status == 0" type="info">
							生成失败
						  </el-tag>
						  <el-tag v-if="scope.row.status == 1" type="success">已完成</el-tag>
					</div>
					<div v-else>
						<el-tag v-if="scope.row.pdfNum == scope.row.pdfTotal" type="success">已完成</el-tag>
					  <el-tag type="info" v-else>
							{{scope.row.pdfNum}}/{{scope.row.pdfTotal}}
					  </el-tag>
					</div>
			  </template>
			</el-table-column>
			<el-table-column
			  label="操作">
			  <template slot-scope="scope">
				  <div style="display: flex; align-items: center;">
					  <el-button :disabled="scope.row.status == 0?true:false" @click="download(scope.row)" type="text" size="small">下载</el-button>
					  <el-button :disabled="scope.row.status == 0?true:false" @click="deletePdf(scope.row)" type="text" size="small">删除</el-button> 
					  <el-button :disabled="scope.row.status == 1?true:false"  @click="downloadFile(scope.row)" type="text" size="small" v-if="!loadIshow">生成</el-button> 
					  	<div style="display: flex;align-items: center;font-size:12px;margin-left:15px;" v-if="loadIshow">
					  		<img style="width: 15px;margin-right: 4px;" src="../../../assets/image/loading1.gif" alt="">
					  		生成中
					  	</div>
					  <el-button :disabled="scope.row.status == 1?false:true" @click="downloadFile(scope.row)" type="text" size="small" v-if="!loadIshow">重新生成</el-button> 
				  </div>
				  
				</template>
			</el-table-column>
		  </el-table>
	</div>
</template>

<script>
	import {downloadPdfPage,downloadPdfTj,downloadPdfDelete,downloadPdfExamGenerate} from '../../../api/scoreapi.js'
	export default{
		data(){
			return {
				tableData:[ ],
				pageIndex:1,
				pagesize:500,
				tableheight:'',
				loadIshow:false
			}
		},
		mounted() {
			localStorage.setItem('menuState', 2);
			this.getScreenHeight();
			//在窗口大小变化时更新屏幕高度，可以监听window的resize事件
			window.addEventListener('resize', this.getScreenHeight);
			let newtitle = decodeURIComponent(this.$route.query.con)
			this.titlecontent = JSON.parse(newtitle)
			localStorage.setItem('menuState', 2);
			this.downloadFilePdf() //pdf列表
		},
		
		methods:{
			getScreenHeight() {
			  // 获取屏幕高度并更新data中的screenHeight
			  this.tableheight = parseInt(window.innerHeight-450);
			},
			//pdf列表
			downloadFilePdf(){
				let obj = {
					navId:this.titlecontent.n5Id,
					pageIndex:this.pageIndex,
					pageSize:this.pageSize
				}
				downloadPdfPage(obj).then(res=>{
					if(res.code==0){
						this.tableData = res.data
					}else{
						this.$message({
							type: 'error',
							message: res.msg
						}); 
					}
				})
			},
			// 刷新进度
			shuaxinjd(){
				this.downloadFilePdf()
			},
			//按条件下载
			downloadFile(con,num){
				if(con.pdfType==3){
					let obj = {
					    navId: this.titlecontent.n5Id
					}
					downloadPdfExamGenerate(obj).then(res => {
					    if (res.code == 0) {
					        this.$message.success('点击右上角刷新查看进度')
							// this.loadIshow = false
					    }
					})
				}else{
					let obj={
						navId:con.navId,
						groupId:con.gradeId?con.gradeId:undefined,
						type4:con.type4?con.type4:undefined,
						type:con.pdfType
					}
					downloadPdfTj(obj).then(res=>{
						console.info(res)
						this.downloadFilePdf()
					})
				}
			},
			//下载download
			download(con){
				if (con.pdfUrl) {
					console.info(con.pdfUrl.split('.').pop())
					if(con.pdfUrl.split('.').pop()=='zip'){
						fetch(this.$imgUrl1 + con.pdfUrl)
						.then(response => {
						  if (response.ok) {
							return response.blob();
						  }
						  throw new Error('Network response was not ok.');
						})
						.then(blob => {
						  const downloadUrl = window.URL.createObjectURL(blob);
						  const link = document.createElement('a');
						  link.href = downloadUrl;
						  link.setAttribute('download', con.pdfName+'.zip'); // 指定下载文件名
						  document.body.appendChild(link);
						  link.click();
						  document.body.removeChild(link);
						  window.URL.revokeObjectURL(downloadUrl); // 释放URL对象
						})
						.catch(error => {
						  this.$message({ type: 'error', message: '下载文件失败: ' + error.message });
						});
					}else{
						fetch(this.$imgUrl1 + con.pdfUrl)
						.then(response => {
						  if (response.ok) {
							return response.blob();
						  }
						  throw new Error('Network response was not ok.');
						})
						.then(blob => {
						  const downloadUrl = window.URL.createObjectURL(blob);
						  const link = document.createElement('a');
						  link.href = downloadUrl;
						  link.setAttribute('download', con.pdfName+'.pdf'); // 指定下载文件名
						  document.body.appendChild(link);
						  link.click();
						  document.body.removeChild(link);
						  window.URL.revokeObjectURL(downloadUrl); // 释放URL对象
						})
						.catch(error => {
						  this.$message({ type: 'error', message: '下载文件失败: ' + error.message });
						});
					}
				} else {
				  this.$message({ type: 'error', message: '生成下载文件失败' });
				}
			},
			//删除
			deletePdf(con){
				let this_ = this
				this.$confirm('此操作将删除该文件, 是否继续?', '提示', {
				  confirmButtonText: '确定',
				  cancelButtonText: '取消',
				  type: 'warning'
				}).then(() => {
					downloadPdfDelete({id: con.id}).then(res=>{
						if (res.code == 0) {
						  this_.$message.success('删除成功');
						  let query = {
						    pageIndex: this_.pageIndex,
						    pageSize: this_.pageSize,
						    navId: this_.titlecontent.n5Id,
						  }
						  this_.downloadFilePdf(query)
						} else {
						  this_.$message.error(res.msg);
						}
					})
				}).catch(() => {
				    this_.$message.error();  
				})
			}
		}
	}
</script>

<style scoped>
	.boxmain h3{
		padding:20px 0;
		font-size:18px;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.boxmain{
		padding:30px;
	}
</style>